/* Vant主题定制 - 现代美学风格 */
:root {
  /* 主色调 - 更现代的色彩系统 */
  --van-primary-color: #6366f1; /* 柔和的靛蓝 */
  --van-success-color: #10b981; /* 自然的翡翠绿 */
  --van-danger-color: #ef4444; /* 适中的红色 */
  --van-warning-color: #f59e0b; /* 温暖的琥珀色 */

  /* 中性色调 - 更精致的灰度 */
  --van-text-color: #1f2937; /* 深蓝灰 */
  --van-text-color-2: #4b5563; /* 中灰 */
  --van-text-color-3: #6b7280; /* 浅灰 */
  --van-active-color: #e5e7eb; /* 极浅灰 */
  --van-active-opacity: 0.7;
  --van-disabled-opacity: 0.5;

  /* 背景色 - 层次分明的浅色系 */
  --van-background: #f9fafb; /* 非常浅的灰 */
  --van-background-2: #ffffff; /* 纯白 */

  /* 边框与圆角 */
  --van-border-color: #e5e7eb; /* 浅灰边框 */
  --van-border-width: 1px;
  --van-radius-sm: 6px;  /* 更圆润的圆角 */
  --van-radius-md: 10px;
  --van-radius-lg: 14px;
  --van-radius-max: 999px;

  /* 字体与排版 */
  --van-font-size-xs: 12px;
  --van-font-size-sm: 14px;
  --van-font-size-md: 16px;
  --van-font-size-lg: 18px;
  --van-font-bold: 600; /* 稍重的字重 */

  /* 动画效果 */
  --van-animation-duration-base: 0.3s;
  --van-animation-duration-fast: 0.2s;
  --van-animation-timing-function-enter: cubic-bezier(0.25, 0.1, 0.25, 1);
  --van-animation-timing-function-leave: cubic-bezier(0.5, 0, 0.75, 1);

  /* 阴影效果 - 更立体的阴影 */
  --van-shadow-1: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.1);
  --van-shadow-2: 0 4px 6px rgba(0, 0, 0, 0.05), 0 2px 4px rgba(0, 0, 0, 0.1);
  --van-shadow-3: 0 10px 15px rgba(0, 0, 0, 0.05), 0 4px 6px rgba(0, 0, 0, 0.1);

  /* 组件定制 */
  --van-tabbar-height: 56px;
  --van-tabbar-background: rgba(255, 255, 255, 0.96);
  --van-tabbar-item-active-background: rgba(241, 245, 249, 0.8);

  --van-button-default-border-color: var(--van-border-color);
  --van-button-border-radius: var(--van-radius-md);

  --van-card-background: var(--van-background-2);
  --van-card-shadow: var(--van-shadow-1);
  --van-card-border-radius: var(--van-radius-lg);

  --van-field-label-color: var(--van-text-color-2);
}

/* 暗色模式 - 深色美学 */
[data-theme='dark'] {
  /* 主色调 - 降低饱和度 */
  --van-primary-color: #818cf8; /* 亮靛蓝 */
  --van-success-color: #34d399; /* 亮翡翠 */
  --van-danger-color: #f87171; /* 亮珊瑚红 */
  --van-warning-color: #fbbf24; /* 亮琥珀 */

  /* 中性色调 - 深色系 */
  --van-text-color: #e5e7eb; /* 浅灰 */
  --van-text-color-2: #9ca3af; /* 中灰 */
  --van-text-color-3: #6b7280; /* 深灰 */
  --van-active-color: #374151; /* 深蓝灰 */

  /* 背景色 - 层次分明的深色系 */
  --van-background: #111827; /* 深蓝黑 */
  --van-background-2: #1f2937; /* 深蓝灰 */

  /* 边框 */
  --van-border-color: #374151; /* 深灰边框 */

  /* 阴影 - 更暗的阴影 */
  --van-shadow-1: 0 1px 3px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.3);
  --van-shadow-2: 0 4px 6px rgba(0, 0, 0, 0.2), 0 2px 4px rgba(0, 0, 0, 0.3);
  --van-shadow-3: 0 10px 15px rgba(0, 0, 0, 0.2), 0 4px 6px rgba(0, 0, 0, 0.3);

  /* 组件定制 */
  --van-tabbar-background: rgba(17, 24, 39, 0.95);
  --van-tabbar-item-active-background: rgba(31, 41, 55, 0.8);

  --van-card-background: var(--van-background-2);
  --van-card-shadow: none;

  /* 特殊处理 */
  img {
    opacity: 0.9;
    filter: brightness(0.9);
  }
}

/* 全局样式增强 */
body {
  background: var(--van-background);
  color: var(--van-text-color);
  transition: all 0.3s ease;
}

/* 增强输入框在暗色模式的可读性 */
[data-theme='dark'] .van-field__control {
  background-color: var(--van-background-2);
}

/* 增强卡片分隔效果 */
.van-card {
  border: 1px solid var(--van-border-color);
}

/* 优化按钮悬停效果 */
.van-button:not(.van-button--disabled):hover {
  opacity: 0.9;
  transform: translateY(-1px);
}

/* 优化暗色模式下的分割线 */
[data-theme='dark'] .van-divider {
  border-color: var(--van-border-color);
}